<template>
  <div v-loading.fullscreen.lock="loading" element-loading-text="加载中..." :class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]">
    <template v-if="!loading">
      <main-navbar />
      <main-sidebar v-if="$store.state.layoutType === 'default'" />
      <div class="aui-content__wrapper" :class="`aui-content--${$store.state.layoutType}`">
        <main-content v-if="!$store.state.contentIsNeedRefresh" />
      </div>
      <main-theme-tools />
    </template>
  </div>
</template>

<script>
import Cookies from 'js-cookie'
import MainNavbar from './main-navbar'
import MainSidebar from './main-sidebar'
import MainContent from './main-content'
import MainThemeTools from './main-theme-tools'
import debounce from 'lodash/debounce'
export default {
  provide () {
    return {
      // 刷新
      refresh () {
        this.$store.state.contentIsNeedRefresh = true
        this.$nextTick(() => {
          this.$store.state.contentIsNeedRefresh = false
        })
      }
    }
  },
  data () {
    return {
      loading: false,
      dataForm: {
        accountId: Cookies.get('token'),
        redisDel: 1,
        type: 1
      }
    }
  },
  components: {
    MainNavbar,
    MainSidebar,
    MainContent,
    MainThemeTools
  },
  watch: {
    $route: 'routeHandle'
  },
  created () {
    this.windowResizeHandle()
    this.getUserInfo()
    this.routeHandle(this.$route)
  },
  methods: {
    // 窗口改变大小
    windowResizeHandle () {
      this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
      window.addEventListener('resize', debounce(() => {
        this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
      }, 150))
    },
    // 路由, 监听 切换登录
    routeHandle (route) {
      console.log('关闭' + this.$WebImOptions.user)
      this.$imConn.close()
      if (route.params.name) {
        console.log(route)
        this.$store.state.imUserList.user = {
          name: route.params.name,
          password: route.params.password
        }
      } else {
        this.$store.state.imUserList.user = {
          name: this.$store.state.imUserList.teacherMap.hxAccount,
          password: this.$store.state.imUserList.teacherMap.password
        }
      }
      console.log('登录' + this.$store.state.imUserList.user.name)
      var tab = this.$store.state.contentTabs.filter(item => item.name === route.name)[0]
      if (!tab) {
        tab = {
          ...window.SITE_CONFIG['contentTabDefault'],
          ...route.meta,
          'name': route.name,
          'params': { ...route.params },
          'query': { ...route.query }
        }
        this.$store.state.contentTabs = this.$store.state.contentTabs.concat(tab)
      }
      this.$store.state.sidebarMenuActiveName = tab.menuId.toString()
      this.$store.state.contentTabsActiveName = tab.name
    },
    // 获取用户数据
    getUserInfo () {
      return this.$http.get('/easemobLoginController/userList',
        {
          params: {
            accountId: this.dataForm.accountId,
            redisDel: this.dataForm.redisDel,
            type: this.dataForm.type
          }
        }).then(({ data: res }) => {
        if (res.code !== 200) {
          return this.$message.error(res.msg)
        }
        this.$store.state.imUserList.user = res.data.teacherMap
        this.$store.state.imUserList.teacherMap = res.data.teacherMap
        this.$store.state.imUserList.minList = res.data.minList
      }).catch(() => {})
    }
  }
}
</script>
